<%@ taglib prefix="s" uri="/struts-tags" %>
<%--
  Created by IntelliJ IDEA.
  User: 高金磊
  Date: 2021/3/31
  Time: 10:33
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <title>新增文档 - bootstrap中文后台管理系统模板</title>
    <link rel="icon" href="<%=basePath%>favicon.ico" type="image/ico">
    <meta name="keywords" content="后台模板,后台管理系统,HTML模板">
    <meta name="description" content="基于Bootstrap的后台管理系统模板">
    <link href="<%=basePath%>css/bootstrap.min.css" rel="stylesheet">
    <link href="<%=basePath%>css/fonts.css" rel="stylesheet">
    <!--标签插件-->
    <link rel="stylesheet" href="<%=basePath%>js/jquery-tags-input/jquery.tagsinput.min.css">
    <link href="<%=basePath%>css/style.css" rel="stylesheet">
    <style>

        #textarea {
            display: block;
            margin:0 auto;
            overflow: hidden;
            width: 550px;
            font-size: 14px;
            height: 18px;
            line-height: 24px;
            padding:2px;
        }
        textarea {
            outline: 0 none;
            border-color: rgba(82, 168, 236, 0.8);
            box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
        }

    </style>
</head>

<body>
<%--<s:form action="AddBookInfo" method="POST" enctype="multipart/form-data">--%>
    <%--<span>书名：</span>--%>
    <%--<span><input name="book_name" type="text" value="<%=request.getParameter("book_name")==null?"":request.getParameter("book_name")%>" ></span><br><br>--%>
    <%--<span>作者</span>--%>
    <%--<span><input name="book_Author" type="text" value="<%=request.getParameter("book_Author")==null?"":request.getParameter("book_Author")%>"></span><br><br>--%>
    <%--<span>简介</span>--%>
    <%--<span><input name="book_Info" type="text" value="<%=request.getParameter("book_Info")==null?"":request.getParameter("book_Info")%>"></span><br><br>--%>
    <%--<span>标签1</span>--%>
    <%--<span><input name="book_tag1" type="text" value="<%=request.getParameter("book_tag1")==null?"":request.getParameter("book_tag1")%>"></span><br><br>--%>
    <%--<span>标签2</span>--%>
    <%--<span><input name="book_tag2" type="text" value="<%=request.getParameter("book_tag2")==null?"":request.getParameter("book_tag2")%>"></span><br><br>--%>
    <%--<span>图书总量</span>--%>
    <%--<span><input name="sum" type="number" value="<%=request.getParameter("sum")==null?"":request.getParameter("sum")%>"></span><br><br>--%>
    <%--<span>图书照片</span>--%>
    <%--<s:file type="file" name="book_picture_File" value="选择上传的文件" onchange="newfile(this)" />--%>
    <%--<img width="100" src="<%=basePath%>images/def_book_pic.png" id="img-id" alt="000" />--%>
    <%--<script>--%>
        <%--function newfile(obj) {--%>
            <%--var reader = new FileReader();	// 实例化一个FileReader对象，用于读取文件--%>
            <%--//获取到img标签的对象--%>
            <%--var img = document.getElementById("img-id");--%>
            <%--//读取File对象的数据--%>
            <%--reader.onload = function(evt){--%>
                <%--img.src = evt.target.result;--%>
            <%--}--%>
            <%--reader.readAsDataURL(obj.files[0]);--%>
        <%--}--%>
    <%--</script>--%>

    <%--<br><br>--%>
    <%--&lt;%&ndash;<span> 登陆密码</span>&ndash;%&gt;--%>
    <%--&lt;%&ndash;<span> <input type="text" name="spd" value="<%=request.getParameter("spd")==null?"":request.getParameter("spd")%>"></span><br><br>&ndash;%&gt;--%>
    <%--&lt;%&ndash;<span>确认密码</span>&ndash;%&gt;--%>
    <%--&lt;%&ndash;<span>  <input name="spdcheck" type="text" value="<%=request.getParameter("spdcheck")==null?"":request.getParameter("spdcheck")%>"></span><br><br>&ndash;%&gt;--%>
    <%--<span style="font-size: 9px; color: red"> <s:actionerror/></span><br><br><br>--%>
    <%--<button style="position: absolute;  left: 60%;float: bottom;"><input type="submit" value="提交"></button>--%>
    <%--<button style="position: absolute;  left: 30%;float: bottom;"> <input type="reset" value="重置"></button>--%>

<%--</s:form>--%>

    <!--页面主要内容-->
    <main class="ftdms-layout-content">

        <div class="container-fluid" style="margin-bottom:90px;">
            <span style="font-size: 14px; color: red"> <s:actionerror/></span>
            <span style="font-size: 14px; color: #24bb10"> <s:actionmessage/></span>
            <div class="row" style="margin-top:15px;">
                <div class="col-lg-12">
                    <div class="card">
                        <div class="card-body">

                            <form action="AddBookInfo.action" method="post" class="row" enctype="multipart/form-data" >
                                <div class="form-group col-md-12">
                                    <label for="title">书名</label>
                                    <input type="text" class="form-control" id="title" name="book_name"  value="<%=request.getParameter("book_name")==null?"":request.getParameter("book_name")%>"  />
                                </div>
                                <div class="form-group col-md-12">
                                    <label for="seo_keywords">作者</label>
                                    <input class="form-control" id="seo_keywords" name="book_Author" type="text" value="<%=request.getParameter("book_Author")==null?"":request.getParameter("book_Author")%>" />
                                </div>
                                <div class="form-group col-md-12">
                                    <label for="seo_keywords">简介</label>
                                    <textarea id="textarea" name="book_Info"  style="width: 100%;background-color: rgba(0,0,0,0);">
                                        <%=request.getParameter("book_Info")==null?"":request.getParameter("book_Info")%>
                                      </textarea>
                                </div>
                                <div class="form-group col-md-12">
                                    <label for="seo_description">标签1</label>
                                    <input class="form-control" id="seo_description" name="book_tag1" type="text" value="<%=request.getParameter("book_tag1")==null?"":request.getParameter("book_tag1")%>"/>
                                </div>

                                <div class="form-group col-md-12">
                                    <label for="seo_keywords">标签2</label>
                                    <input class="form-control" name="book_tag2" type="text" value="<%=request.getParameter("book_tag2")==null?"":request.getParameter("book_tag2")%>" />
                                </div>
                                <div class="form-group col-md-12">
                                    <label for="seo_keywords">图书总量</label>
                                    <input min="1" max="100000" class="form-control"  name="sum" type="number" value="<%=request.getParameter("sum")==null?"":request.getParameter("sum")%>" />
                                </div>
                                <div class="form-group col-md-12">
                                    <label for="seo_keywords">封面</label>
                                    <input type="file" name="book_picture_File" value="选择上传的文件" onchange="newfile(this)" />
                                    <img width="100" src="<%=basePath%>images/def_book_pic.png" id="img-id" alt="000" />
                                    <script>
                                        function newfile(obj) {
                                            var reader = new FileReader();	// 实例化一个FileReader对象，用于读取文件
                                            //获取到img标签的对象
                                            var img = document.getElementById("img-id");
                                            //读取File对象的数据
                                            reader.onload = function(evt){
                                                img.src = evt.target.result;
                                            }
                                            reader.readAsDataURL(obj.files[0]);
                                        }
                                    </script>                                </div>
                                <div>

                                    <div class="form-group col-md-12">
                                        <button type="submit" class="btn btn-label btn-primary" >
                                        <label class="ftsucai-gou-2">
                                        </label>
                                            确 定
                                        </button>
                                        <button type="reset" class="btn btn-label btn-warning">
                                            <label class="ftsucai-del-1">
                                            </label>
                                            重置
                                        </button>
                                    </div>
                                </div>
                            </form>

                        </div>
                    </div>
                </div>

            </div>

        </div>

        <br>
        <br>
        <br>
        <br>
        <br>

    </main>
    <!--End 页面主要内容-->

    <script type="text/javascript" src="<%=basePath%>js/jquery.min.js"></script>
    <script type="text/javascript" src="<%=basePath%>js/bootstrap.js"></script>
    <script type="text/javascript" src="<%=basePath%>js/perfect-scrollbar.min.js"></script>
    <!--标签插件-->
    <script src="<%=basePath%>js/jquery-tags-input/jquery.tagsinput.min.js"></script>
    <script type="text/javascript" src="<%=basePath%>js/main.min.js"></script>
</body>


<script>
    var autoTextarea = function (elem, extra, maxHeight) {
        extra = extra || 0;
        var isFirefox = !!document.getBoxObjectFor || 'mozInnerScreenX' in window,
            isOpera = !!window.opera && !!window.opera.toString().indexOf('Opera'),
            addEvent = function (type, callback) {
                elem.addEventListener ?
                    elem.addEventListener(type, callback, false) :
                    elem.attachEvent('on' + type, callback);
            },
            getStyle = elem.currentStyle ? function (name) {
                var val = elem.currentStyle[name];

                if (name === 'height' && val.search(/px/i) !== 1) {
                    var rect = elem.getBoundingClientRect();
                    return rect.bottom - rect.top -
                        parseFloat(getStyle('paddingTop')) -
                        parseFloat(getStyle('paddingBottom')) + 'px';
                };

                return val;
            } : function (name) {
                return getComputedStyle(elem, null)[name];
            },
            minHeight = parseFloat(getStyle('height'));

        elem.style.resize = 'none';

        var change = function () {
            var scrollTop, height,
                padding = 0,
                style = elem.style;

            if (elem._length === elem.value.length) return;
            elem._length = elem.value.length;

            if (!isFirefox && !isOpera) {
                padding = parseInt(getStyle('paddingTop')) + parseInt(getStyle('paddingBottom'));
            };
            scrollTop = document.body.scrollTop || document.documentElement.scrollTop;

            elem.style.height = minHeight + 'px';
            if (elem.scrollHeight > minHeight) {
                if (maxHeight && elem.scrollHeight > maxHeight) {
                    height = maxHeight - padding;
                    style.overflowY = 'auto';
                } else {
                    height = elem.scrollHeight - padding;
                    style.overflowY = 'hidden';
                };
                style.height = height + extra + 'px';
                scrollTop += parseInt(style.height) - elem.currHeight;
                document.body.scrollTop = scrollTop;
                document.documentElement.scrollTop = scrollTop;
                elem.currHeight = parseInt(style.height);
            };
        };

        addEvent('propertychange', change);
        addEvent('input', change);
        addEvent('focus', change);
        change();
    };

    var text = document.getElementById("textarea");
    autoTextarea(text);// 调用
</script>
</html>
